<template>
  <div class="pagebox">
    <!--  -->
    <crumbs @goBack="goBack" :superiorMenu="['生产管理']" currentMenu="领料单"></crumbs>
    <a-card :bordered="false" style="height: 100%; margin-top: 12px">
      <a-button @click="handleShowFilter" icon="filter"
        >筛选 <span class="filter-num" style="margin-left: 5px">{{ ' ' + filteredNums }}</span></a-button
      >
      <a-button @click="showColumn" icon="unordered-list" class="btns">设置列</a-button>
      <div class="right-btn">
        <!-- <a-button @click="importFile">导入</a-button>
        <a-button @click="exportFile" class="btns">导出</a-button> -->
        <a-button @click="handleAdd" type="primary" class="btns"> +申请领料 </a-button>
      </div>
      <a-table
        row-key="id"
        :key="tableKey"
        size="middle"
        :scroll="{ x: computedX, y: 'calc(100vh - 366px)' }"
        :columns="columns"
        :dataSource="modelList"
        :pagination="false"
        @change="tableChange"
        class="j-table-force-nowrap"
        :components="drag(columns, 'MATERIAL_REQUISITION_LIST')"
      >
        <span slot="actions" slot-scope="text, record">
          <a v-if="record.flowStatus == 'RUNNING' && record.createBy == loginUser" @click="handleWithdraw(record)"
            >撤回</a
          >
          <a v-if="record.flowStatus == 'REFUSE' || record.flowStatus == 'TERMINATED'" @click="handleDelete(record)"
            >删除</a
          >
          <!-- <a v-if="record.flowStatus == 'AGREE'" @click="handleEdit(record)">打印</a> -->
        </span>
        <!-- 行信息 -->
        <template slot-scope="text, record" :slot="item.key">
          <span v-for="(item, j) in slotText" :key="j" :title="record[item.key]">
            {{ record[item.key] }}
          </span>
        </template>
        <span
          slot="applyNo"
          :title="record.applyNo"
          slot-scope="text, record"
          class="btn-text"
          @click="handleDetail(record)"
        >
          {{ record.applyNo || '-' }}
        </span>
        <span
          slot="outStockStatus"
          :title="record.outStockStatus == '1' ? '未开始' : record.outStockStatus == '2' ? '进行中' : '已完成'"
          slot-scope="text, record"
          :style="{ color: setColor(record.outStockStatus) }"
        >
          {{ record.outStockStatus == '1' ? '未开始' : record.outStockStatus == '2' ? '进行中' : '已完成' }}
        </span>
        <span slot="flowStatusName" slot-scope="text, record" :style="{ color: statusColor(record.flowStatus) }">
          <div>{{ text || '-' }}</div>
        </span>
        <template slot="outStockProgress" slot-scope="text, record">
          <div
            style="text-align: center"
            class="limit-text"
            :title="`${record.completeNum || 0}/${record.boundNum || 0}`"
          >
            {{ record.completeNum || 0 }}/{{ record.boundNum || 0 }}
          </div>
          <a-progress
            :percent="(record.completeNum / record.boundNum) * 100"
            :strokeWidth="5"
            :showInfo="false"
            :strokeColor="checkStatus((record.completeNum / record.boundNum) * 100)"
          />
        </template>
        <span
          slot="orderCode"
          :title="record.orderCode"
          slot-scope="text, record"
          class="btn-text"
          @click="orderDetail(record)"
        >
          {{ record.orderCode || '-' }}
        </span>
        <!-- 输入框搜索 -->
        <div slot="searchInput" slot-scope="{ selectedKeys, confirm, clearFilters, column }" class="searchWorkOreder">
          <a-input
            placeholder="请输入"
            v-model="filterForm[column.dataIndex]"
            style="width: 188px; display: block"
            @pressEnter="handleSearch"
          />
          <a-button
            type="primary"
            style="width: 80px; margin-left: 20px; display: block"
            @click="() => handleSearch(selectedKeys, confirm, column.dataIndex, clearFilters)"
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot="searchIcon"
          slot-scope="filtered"
          type="search"
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
        <!-- 选择搜索 -->
        <div slot="selectDropdown" slot-scope="{ confirm, clearFilters, column }" class="searchWorkOreder">
          <a-select
            mode="multiple"
            placeholder="请选择"
            allowClear
            style="width: 188px"
            v-model="filterForm[column.dataIndex]"
            @change="(v) => changeStatus(v, column.dataIndex)"
          >
            <a-select-option v-for="(item, i) in column.options" :key="i" :value="item.value">{{
              item.text
            }}</a-select-option>
          </a-select>
          <a-button
            type="primary"
            style="width: 80px; margin-left: 20px; display: block"
            @click="() => handleSearch(confirm, column.dataIndex, clearFilters)"
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot="selectIcon"
          slot-scope="filtered"
          type="filter"
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
        <!-- 日期搜索 -->
        <div slot="datePicker" slot-scope="{ confirm, clearFilters, column }" class="searchWorkOreder">
          <a-range-picker
            style="width: 188px"
            v-model="dateForm[column.dataIndex]"
            format="YYYY-MM-DD"
            :placeholder="['开始时间', '结束时间']"
            @change="(v) => onOk(v, column.dataIndex)"
          />
          <a-button
            type="primary"
            style="width: 80px; margin-left: 20px; display: block"
            @click="() => handleSearch(confirm, column.dataIndex, clearFilters)"
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot="dateIcon"
          slot-scope="filtered"
          type="filter"
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
        <!-- 人员选择 -->
        <div slot="selectPeople" slot-scope="{ confirm, clearFilters, column }" class="searchWorkOreder">
          <j-select-user-by-dep
            @changeRow="userFilter"
            v-model="userIds"
            :limit="5"
            :seldep="true"
            :modalWidth="1000"
            :multi="true"
          ></j-select-user-by-dep>
          <a-button
            type="primary"
            style="width: 80px; margin-left: 20px; display: block"
            @click="() => handleSearch(confirm, column.dataIndex, clearFilters)"
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot="peopleIcon"
          slot-scope="filtered"
          type="filter"
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
      </a-table>
      <SetColumn
        columnName="设置列"
        ref="SetColumn"
        v-if="showSetColumn"
        @sureBtn="sureBtn"
        @cancelBtn="showSetColumn = false"
      />
    </a-card>
    <a-drawer placement="right" width="500" :visible="showFilter" @close="closeFilter">
      <div class="filter-body">
        <div slot="title" class="uni-card filter-tit">
          筛选 <span class="filter-num">{{ filteredNums }}</span>
        </div>
        <div class="uni-card" v-if="filteredNums > 0" style="background: #fff">
          <div v-for="(item, i) in filteredList" :key="i" v-show="item.text" class="tag-wrap">
            <span class="filter-tag" @click="delFiltered(item.key)">
              <span class="tag-text">{{ `${item.title}：${item.text}` }}</span>
              <a-icon type="close" style="float: right" />
            </span>
          </div>
        </div>
        <div style="overflow-y: scroll; flex: 1; padding: 0">
          <div class="uni-card" style="background: #fff">
            <a-form-model ref="ruleForm" layout="vertical" :model="filterForm">
              <a-form-model-item label="申请编号">
                <a-input v-model="filterForm.applyNo" placeholder="请输入" />
              </a-form-model-item>
              <a-form-model-item label="出库状态">
                <a-select
                  mode="multiple"
                  placeholder="请选择"
                  allowClear
                  style="width: 100%"
                  v-model="filterForm['outStockStatus']"
                  @change="(v) => changeStatus(v, 'outStockStatus')"
                >
                  <a-select-option v-for="(item, i) in columnsValue[7].options" :key="i" :value="item.value">{{
                    item.text
                  }}</a-select-option>
                </a-select>
              </a-form-model-item>
              <a-form-model-item label="规格">
                <a-input v-model="filterForm.spec" placeholder="请输入" />
              </a-form-model-item>
              <a-form-model-item label="提交人">
                <j-select-user-by-dep
                  @changeRow="userFilter"
                  v-model="userIds"
                  :limit="5"
                  :seldep="true"
                  :modalWidth="1000"
                  :multi="true"
                ></j-select-user-by-dep>
              </a-form-model-item>
              <a-form-model-item label="提交时间">
                <a-range-picker
                  style="width: 100%"
                  v-model="dateForm['createTime']"
                  format="YYYY-MM-DD"
                  :placeholder="['开始时间', '结束时间']"
                  @change="(v) => onOk(v, 'createTime')"
                />
              </a-form-model-item>
            </a-form-model>
          </div>
        </div>
        <div class="footer-submit">
          <a-button class="margin-btn" @click="resetFilter">重置</a-button>
          <a-button type="primary" @click="handleFilter">确定</a-button>
        </div>
      </div>
    </a-drawer>
    <!-- 全选/分页 -->
    <div
      class="uni-card resetPadding"
      :style="{
        position: 'fixed',
        bottom: 0,
        right: 0,
        zIndex: 2,
        left: collapsed ? '79px' : '208px',
        background: '#fff',
        paddingLeft: '43px',
      }"
    >
      <div style="display: inline-block">
        <span>
          {{ `共 ${total} 条` }}
        </span>
      </div>
      <div style="display: inline-block; float: right">
        <a-pagination
          :total="total"
          v-model="current"
          :page-size-options="pageSizeOptions"
          :page-size="pageSize"
          @change="onChangePage"
          @showSizeChange="onShowSizeChange"
          show-quick-jumper
          show-size-changer
        />
      </div>
    </div>
    <materialRequisitionForm @refresh="handleSearch" ref="materialRequisitionForm"></materialRequisitionForm>
    <windowDetail ref="windowDetail"></windowDetail>
    <orderDetail ref="orderDetail"></orderDetail>
  </div>
</template>
<script>
import SetColumn from '@/pubComponent/SetColumn.vue'
import crumbs from '@/components/crumbs.vue'
import { getNewColumns, subStrText, camelCase2UnderLine } from '@/utils/util'
import { API } from '@/api/requestFzs'
import { getEnableOne } from '@/api/api'
import moment from 'dayjs'
import { mapState } from 'vuex'
import tableDragResize from '@/mixins/tableDragResize'
import materialRequisitionForm from '@/views/workManagement/materialRequisition/materialRequisitionForm'
import windowDetail from '@/views/workManagement/materialRequisition/materialRequisitionDetail'
import orderDetail from '@/views/workManagement/workOrder/workOrderDetail'
// 表头
const columnsValue = [
  {
    title: '申请编号',
    ellipsis: true,
    dataIndex: 'applyNo',
    width: 180,
    scopedSlots: {
      filterDropdown: 'searchInput',
      filterIcon: 'searchIcon',
      customRender: 'applyNo',
    },
    sorter: true,
  },
  {
    title: '工单编号',
    ellipsis: true,
    dataIndex: 'orderCode',
    width: 180,
    scopedSlots: { customRender: 'orderCode' },
    sorter: true,
  },
  {
    title: '产品编号',
    ellipsis: true,
    dataIndex: 'goodsCode',
    width: 180,
  },
  {
    title: '产品名称',
    ellipsis: true,
    dataIndex: 'goodsName',
    width: 150,
    scopedSlots: { customRender: 'goodsName' },
  },
  {
    title: '规格',
    ellipsis: true,
    dataIndex: 'spec',
    width: 150,
    scopedSlots: {
      filterDropdown: 'searchInput',
      filterIcon: 'searchIcon',
      customRender: 'spec',
    },
  },
  {
    title: '基本单位',
    width: 100,
    ellipsis: true,
    dataIndex: 'basicUnitText',
    scopedSlots: { customRender: 'basicUnitText' },
  },
  {
    title: '出库进度',
    ellipsis: true,
    dataIndex: 'outStockProgress',
    width: 150,
    scopedSlots: { customRender: 'outStockProgress' },
  },
  {
    title: '出库状态',
    ellipsis: true,
    dataIndex: 'outStockStatus',
    width: 150,
    scopedSlots: {
      filterDropdown: 'selectDropdown',
      filterIcon: 'selectIcon',
      customRender: 'outStockStatus',
    },
    options: [
      { text: '未开始', value: 1 },
      { text: '进行中', value: 2 },
      { text: '已完成', value: 3 },
    ],
  },
  {
    title: '审核状态',
    ellipsis: true,
    dataIndex: 'flowStatusName',
    width: 100,
    scopedSlots: { customRender: 'flowStatusName' },
  },
  {
    title: '领料人',
    ellipsis: true,
    dataIndex: 'reciverIdText',
    width: 120,
  },
  {
    title: '领用时间',
    ellipsis: true,
    dataIndex: 'receiveTime',
    width: 180,
  },
  {
    title: '提交人',
    ellipsis: true,
    dataIndex: 'createByText',
    width: 120,
    scopedSlots: {
      filterDropdown: 'selectPeople',
      filterIcon: 'peopleIcon',
      customRender: 'createByText',
    },
  },
  {
    title: '提交时间',
    ellipsis: true,
    dataIndex: 'createTime',
    width: 180,
    sorter: true,
    scopedSlots: {
      filterDropdown: 'datePicker',
      filterIcon: 'dateIcon',
      customRender: 'createTime',
    },
  },
  {
    title: '备注',
    ellipsis: true,
    dataIndex: 'remark',
    width: 150,
    scopedSlots: { customRender: 'remark' },
  },
  // {
  //   fixed: 'right',
  //   title: '操作',
  //   align: 'left',
  //   dataIndex: 'actions',
  //   ellipsis: true,
  //   scopedSlots: { customRender: 'actions' },
  // },
]
const actionArr = [
  {
    fixed: 'right',
    title: '操作',
    align: 'left',
    width: 100,
    dataIndex: 'actions',
    ellipsis: true,
    scopedSlots: { customRender: 'actions' },
  },
]
export default {
  mixins: [tableDragResize],
  data() {
    return {
      columnsValue,
      moment,
      subStrText,
      selectedRowKeys: [],
      showFilter: false, // 筛选抽屉
      modelList: [], // 列表数据
      showSetColumn: false, // 显示
      colunmArr: [
        {
          checkAll: false, //当前组是否全选
          indeterminate: false, //当前组不全选且有选择项时显示状态
          checkedList: [], //已选数据（不包括所有属性，只含有所选项的每一项的value）
          selectList: [], //已选数据（包括所有属性）
          topTitle: '基础字段', //当前组顶部字段
          plainOptions: [], //当前组提供可供选择的选项
        },
      ],
      //全选按钮
      indeterminate: false,
      checkAll: false,
      current: 1,
      total: 0,
      pageSize: 10,
      pageSizeOptions: ['10', '20', '30', '40', '50'],
      columns: [
        {
          title: '申请编号',
          ellipsis: true,
          dataIndex: 'applyNo',
          width: 180,
          scopedSlots: {
            filterDropdown: 'searchInput',
            filterIcon: 'searchIcon',
            customRender: 'applyNo',
          },
          sorter: true,
        },
        {
          title: '工单编号',
          ellipsis: true,
          dataIndex: 'orderCode',
          width: 180,
          scopedSlots: { customRender: 'orderCode' },
          sorter: true,
        },
        {
          title: '产品名称',
          ellipsis: true,
          dataIndex: 'goodsName',
          width: 150,
          scopedSlots: { customRender: 'goodsName' },
        },
        {
          title: '出库进度',
          ellipsis: true,
          dataIndex: 'outStockProgress',
          width: 150,
          scopedSlots: { customRender: 'outStockProgress' },
        },
        {
          title: '出库状态',
          ellipsis: true,
          dataIndex: 'outStockStatus',
          width: 150,
          scopedSlots: {
            filterDropdown: 'selectDropdown',
            filterIcon: 'selectIcon',
            customRender: 'outStockStatus',
          },
          options: [
            { text: '未开始', value: 1 },
            { text: '进行中', value: 2 },
            { text: '已完成', value: 3 },
          ],
        },
        {
          title: '审核状态',
          ellipsis: true,
          dataIndex: 'flowStatusName',
          width: 100,
          scopedSlots: { customRender: 'flowStatusName' },
        },
        {
          title: '提交人',
          ellipsis: true,
          dataIndex: 'createByText',
          width: 120,
          scopedSlots: {
            filterDropdown: 'selectPeople',
            filterIcon: 'peopleIcon',
            customRender: 'createByText',
          },
        },
        {
          title: '提交时间',
          ellipsis: true,
          dataIndex: 'createTime',
          width: 180,
          sorter: true,
          scopedSlots: {
            filterDropdown: 'datePicker',
            filterIcon: 'dateIcon',
            customRender: 'createTime',
          },
        },
        // {
        //   fixed: 'right',
        //   title: '操作',
        //   align: 'left',
        //   width: 100,
        //   dataIndex: 'actions',
        //   ellipsis: true,
        //   scopedSlots: { customRender: 'actions' },
        // },
      ],
      filterForm: {
        applyNo: '',
        outStockStatus: undefined,
        applicantId: '',
        createTime: '',
        applyTimeBegin: '',
        applyTimeEnd: '',
      },
      filteredFormLable: {
        applyNo: '申请编号',
        spec: '规格',
        outStockStatus: '出库状态',
        applicantId: '提交人',
        createTime: '提交时间',
      },
      flowStatus: {
        RUNNING: { text: '审批中', color: '#FF943E' },
        REFUSE: { text: '已拒绝', color: '#FF4D4F' },
        CANCELED: { text: '已撤回', color: '#888888' },
        AGREE: { text: '已通过', color: '#00B042' },
        TERMINATED: { text: '已终止', color: '#FF4D4F' },
      },
      userNames: '',
      dateForm: {},
      userIds: '',
      sortForm: {
        sortType: '',
        sortColumn: '',
      },
      slotText: [
        { key: 'goodsName', limit: 6 },
        { key: 'spec', limit: 6 },
        { key: 'basicUnitText', limit: 6 },
        { key: 'remark', limit: 10 },
      ],
      loginUser: '',
      tableKey: 1.9,
    }
  },
  components: {
    SetColumn,
    crumbs,
    materialRequisitionForm,
    windowDetail,
    orderDetail,
  },
  computed: {
    computedX() {
      let xnum = 0
      for (let item of this.columns) {
        xnum += Number(item.width) || 0
      }
      return xnum + 60
    },
    ...mapState({
      collapsed: (state) => state.user.collapsed,
    }),
    filteredList() {
      let list = []
      for (let key in this.filterForm) {
        if (key == 'createTime') {
          list.push({
            title: this.filteredFormLable[key],
            text: this.filterForm.applyTimeBegin
              ? moment(this.filterForm.applyTimeBegin).format('YYYY-MM-DD') +
                '-' +
                moment(this.filterForm.applyTimeEnd).format('YYYY-MM-DD')
              : '',
            key,
          })
        } else if (key == 'applyTimeBegin' || key == 'applyTimeEnd') {
          // 什么都不做
        } else if (key == 'outStockStatus' && this.filterForm[key]) {
          list.push({
            title: this.filteredFormLable[key],
            text: this.statusToText(this.filterForm[key]),
            key,
          })
        } else if (key == 'applicantId') {
          list.push({
            title: this.filteredFormLable[key],
            text: this.userNames,
            key,
          })
        } else {
          list.push({
            title: this.filteredFormLable[key],
            text: this.filterForm[key],
            key,
          })
        }
      }
      return list
    },
    filteredNums() {
      let nums = 0
      for (let key in this.filterForm) {
        if (this.filterForm[key]) {
          nums += 1
          if (key == 'applyTimeBegin') {
            nums -= 1
          }
        }
      }
      return nums
    },
  },
  created() {
    let user = localStorage.getItem('pro__Login_Userinfo')
    this.loginUser = JSON.parse(user).value.id
    this.initData()
    this.requestData()
  },
  mounted() {
    console.log('filteredNums:', this.filteredNums)
  },
  methods: {
    changeStatus(v, key) {
      if (v.length == 0) {
        this.filterForm[key] = undefined
      }
    },
    // 渲染前修改表格数据
    // :transformCellText="({ text, column, record, index }) => transformCellText(text, column)"
    transformCellText(text, column) {
      // console.log(text)
      let newText = text
      let limitLen = {
        basicUnitText: 6,
        goodsName: 6,
        spec: 6,
        remark: 10,
      }
      if (typeof text == 'object' && text != null) {
        return text
      } else if (limitLen[column.key]) {
        ;(newText = newText), limitLen[column.key]
      }
      return newText || '-'
    },
    // 排序
    tableChange(pagination, filters, sorter, { currentDataSource }) {
      console.log('看看这是啥33：', sorter)
      if (sorter.order) {
        let sortType = ''
        if (sorter.order == 'ascend') {
          sortType = 'ASC'
        } else {
          sortType = 'DESC'
        }
        this.sortForm = {
          sortType: sortType,
          sortColumn: camelCase2UnderLine(sorter.columnKey),
        }
        this.requestData()
      } else {
        this.sortForm = {
          sortType: '',
          sortColumn: '',
        }
        this.requestData()
      }
    },
    setColor(s) {
      let cor = {
        1: '#888888',
        2: '#1890FF',
        3: '#00B042',
      }
      return cor[s] || ''
    },
    // 出库状态转文字
    statusToText(v) {
      let text = []
      let statusObj = {
        1: '未开始',
        2: '进行中',
        3: '已完成',
      }
      v.forEach((value) => {
        text.push(statusObj[value])
      })
      return text.join(',')
    },
    /* 时间选择 */
    onOk(value, key) {
      if (value.length == 0) {
        this.filterForm[`applyTimeBegin`] = ''
        this.filterForm[`applyTimeEnd`] = ''
        this.filterForm[key] = ''
        return
      }
      this.filterForm[`applyTimeBegin`] = moment(value[0]).startOf('day').format('YYYY-MM-DD HH:mm:ss')
      this.filterForm[`applyTimeEnd`] = moment(value[1]).endOf('day').format('YYYY-MM-DD HH:mm:ss')
    },
    /* 进度条颜色 */
    checkStatus(value) {
      if (value == 0) {
        return '#DFDFDF'
      } else if (value >= 100) {
        return '#4bd863'
      } else {
        return '#1890ff'
      }
    },
    // 选人
    userFilter(v, row) {
      let uIds = []
      let uNames = []
      if (row.length > 0) {
        row.forEach((u) => {
          uIds.push(u.id)
          uNames.push(u.realname)
        })
        this.filterForm.applicantId = uIds.join(',')
        this.userNames = uNames.join(',')
        this.handleSearch()
      } else {
        this.filterForm.applicantId = ''
        this.userNames = ''
      }
    },
    // 分页
    onChangePage(current, pageSize) {
      this.current = current
      this.pageSize = pageSize
      this.requestData()
    },
    onShowSizeChange(current, pageSize) {
      this.current = current
      this.pageSize = pageSize
      this.requestData()
    },
    handleSearch(selectedKeys, confirm, dataIndex, clearFilters) {
      // confirm() //用来关闭搜索弹窗
      // clearFilters() //用来重置搜索内容
      // console.log('这都是啥00：', selectedKeys)
      // console.log('这都是啥11：', confirm)
      // console.log('这都是啥22：', dataIndex)
      // console.log('这都是啥33：', clearFilters)
      this.current = 1
      this.requestData()
    },
    /* 打开筛选 */
    handleShowFilter() {
      this.showFilter = true
    },
    /* 关闭筛选 */
    closeFilter() {
      this.showFilter = false
    },
    /* 确定筛选 */
    handleFilter() {
      this.handleSearch()
      this.showFilter = false
    },
    /* 删除已选 */
    delFiltered(key) {
      if (key == 'createTime') {
        this.dateForm.createTime = null
        this.filterForm.applyTimeBegin = ''
        this.filterForm.applyTimeEnd = ''
      } else if (key == 'outStockStatus') {
        this.filterForm[key] = undefined
      } else if (key == 'applicantId') {
        this.userIds = ''
        this.userNames = ''
        this.filterForm[key] = ''
      } else {
        this.filterForm[key] = ''
      }
    },
    /* 重置筛选 */
    resetFilter() {
      this.filterForm = {
        applyNo: '',
        spec: '',
        outStockStatus: undefined,
        applicantId: '',
        createTime: '',
        applyTimeBegin: '',
        applyTimeEnd: '',
      }
      this.userIds = ''
      this.userNames = ''
      this.dateForm = {}
      this.showFilter = false
      this.handleSearch()
    },
    /* 初始/加载设置列 */
    initData() {
      var oldValue = localStorage.getItem(this.BUSI_CONST.Entity.MATERIAL_REQUISITION_LIST)
      this.columns = getNewColumns(this.columnsValue, JSON.parse(oldValue), actionArr, this.columns)
      getEnableOne({ id: 'MESS_RECEIVE_MATERIAL_APPLY', type: 'add' }).then((res) => {
        if (res.result && res.result == 'false') {
          this.columnsValue = this.columnsValue.filter((item) => item.title != '审核状态')
          this.columns = this.columns.filter((item) => item.title != '审核状态')
        }
      })
      // this.columns[this.columns.length-1].width = ''
    },
    /* 请求列表数据 */
    requestData() {
      let obj = {}
      for (let key in this.filterForm) {
        if (this.filterForm[key]) {
          if (key == 'outStockStatus' && this.filterForm[key]) {
            obj[key] = this.filterForm[key].join(',')
          } else {
            obj[key] = this.filterForm[key]
          }
        }
      }
      let parameter = {
        pageNo: this.current,
        pageSize: this.pageSize,
        ...obj,
        ...this.sortForm,
      }
      API.messReceiveMaterialApplyList(parameter).then((res) => {
        if (res.code == 200) {
          if (res.result.total) {
            this.total = res.result.total
          } else {
            this.total = 0
          }
          this.modelList = res.result.records
          // this.modelList.forEach(record => {
          // })
        }
      })
    },
    /* 打开设置列面板 */
    showColumn() {
      this.showSetColumn = true
      this.$nextTick(() => {
        this.$refs.SetColumn.paramsData(
          this.columnsValue,
          this.BUSI_CONST.Entity.MATERIAL_REQUISITION_LIST,
          this.columns
        )
      })
    },
    /* 设置列 */
    sureBtn(emitArr) {
      this.columns = getNewColumns(this.columnsValue, emitArr, actionArr)
      // this.columns[this.columns.length-1].width = ''
      console.log(this.columns)
      localStorage.setItem(this.BUSI_CONST.Entity.MATERIAL_REQUISITION_LIST, JSON.stringify(emitArr))
      this.tableKey += 1
    },
    /* 导入 */
    importFile() {},
    /* 导出 */
    exportFile() {},
    /* 新建 */
    handleAdd() {
      // this.$router.push('/workManagement/materialRequisitionForm')
      this.$refs.materialRequisitionForm.initForm()
    },
    /* 详情 */
    handleDetail(v) {
      this.$refs.windowDetail.initDetail(v.id)
    },
    /* 工单详情 */
    orderDetail(v) {
      this.$refs.orderDetail.initDetail({ id: v.orderId })
    },
    /* 撤回 */
    handleWithdraw(v) {
      let that = this
      that.$antdConfirm({
        title: '确定撤回吗？',
        content: '撤回后暂不支持再次发起',
        onOk() {
          API.operateRevoke({ flowInstId: v.flowInstId }).then((res) => {
            if (res.code == 200) {
              that.$antdMessage.success(res.message)
              that.handleSearch()
            } else {
              that.$antdMessage.error(res.message)
            }
          })
        },
        onCancel() {},
      })
    },
    statusColor(v) {
      let obj = {
        RUNNING: '#1890FF',
        REFUSE: '#FF4D4F',
        TERMINATED: '#888888',
        AGREE: '#00B042',
      }
      return obj[v] || ''
    },
    /* 删除 */
    handleDelete(v) {
      let that = this
      that.$antdConfirm({
        title: '请确定要删除此申请吗?',
        content: ``,
        onOk() {
          API.messReceiveMaterialLogicDelete({ id: v.id }).then((res) => {
            if (res.code == 200) {
              that.$antdMessage.success('领料申请删除成功！')
              if (that.modelList.length === 1) {
                that.current = that.current == 1 ? 1 : that.current - 1
              }
              that.requestData()
            }
          })
        },
        onCancel() {},
      })
    },
    //点击返回按钮
    goBack() {
      console.log('goback')
    },
  },
}
</script>
<style scoped lang="less">
@import '~@/assets/less/public.less';
.flex(@jc,@ai,@fd:row) {
  display: flex;
  justify-content: @jc;
  align-items: @ai;
  flex-direction: @fd;
}
.header {
  width: 150%;
  margin: -12px -12px @distance4;
}
.backBox {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  .backC {
    cursor: pointer;
    display: flex;
    align-items: center;
  }
}
.j-table-force-nowrap {
  margin-top: @distance1;
}
.btns {
  margin-left: @distance5;
}
.right-btn {
  float: right;
  display: flex;
  justify-content: flex-end;
}
.mg-left {
  margin-left: @distance3;
}
.filter-tit {
  background: #fff;
  border-bottom: 1px solid @greyBorder;
  font-size: @fontSize4;
}
.filter-num {
  color: @normalFont;
}
.filter-body {
  height: 100vh;
  display: flex;
  flex-direction: column;
}
.margin-btn {
  margin-right: @distance5;
}
.filter-tag {
  display: inline-block;
  position: relative;
  padding: 8px 10px;
  border-radius: 4px;
  font-size: @fontSize1;
  line-height: @fontSize1;
  max-width: 100%;
  background: @greyBg;
  color: @titFont;
  cursor: pointer;
  .tag-text {
    display: inline-block;
    padding-right: 20px;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .anticon-close {
    position: absolute;
    right: 8px;
    top: 8px;
  }
}
.tag-wrap:nth-of-type(n + 2) {
  margin-top: 10px;
}
.searchWorkOreder {
  .flex(flex-start, center);
  padding: 8px;
}
.pagebox {
  /deep/ .ant-card-body {
    height: calc(100vh - 214px);
    overflow: hidden;
    padding: 20px 16px;
  }
  /deep/ .ant-table-body-inner {
    background: #fff;
  }
}
</style>
